<template>
	<view class="record-container">
		<view class="" style="z-index: 1000; position: fixed; top: 0; left: 0; right: 0;">
			<view class="" v-show="targets.length>1"
				style="display: flex; justify-content: center; align-items: center; height: 30px; background-color: #F2F2F0;">
				<text>左右滑动切换不同指标页面</text>
			</view>
			<view class=""
				style="display: flex; justify-content: center; align-items: center; background-color: #fff; height: 35px;">
				<text
					style="margin-left: 5px; display: inline-block; display: flex; justify-content: center; align-items: center; height: 30px; width: 30px; border-radius: 50%;"
					v-for=" (item,index1) in targets.length" :key="index1"
					:style="index1 === index ? 'background-color: #3288DF;': 'background-color: #CCCCCC;'">
					{{index1+1}}</text>
			</view>
		</view>
		<view class="" style="background-color: #fff;" :style="{height: (targets.length> 1? '60px': '30px') }">

		</view>
		<swiper class="swiper" :indicator-dots="false" :autoplay="false" duration="500">
			<swiper-item v-for="(target,index) in targets" :key="target.id">
				<wyb-slide-listener @slideLeft="onSlide" @slideRight="onSlide">
					<!-- 此处放你要监听的内容 -->
					<uni-forms :ref="'targetForm'+index" :modelValue="target" label-position="top">
						<uni-forms-item label="指标名称" name="name">
							<uni-easyinput v-model="target.name" disabled />
						</uni-forms-item>
						<uni-forms-item label="活动时间" name="createTime">
							<uni-easyinput v-model="target.createTime" disabled />
						</uni-forms-item>
						<uni-forms-item label="指标说明" name="content">
							<uni-easyinput type="textarea" disabled v-model="target.content" />
						</uni-forms-item>

						<uni-forms-item label="评价结果" name="result">
							<uni-easyinput type="textarea" v-model="target.result" disabled />
						</uni-forms-item>

						<!--<uni-forms-item label="审核评价" name="remark">
							<u-list @scrolltolower="scrolltolower">
								<u-list-item v-for="(item, index2) in target.commentRemark" :key="index2" >
									<u-cell :title="item.content" :isLink="false">
									</u-cell>
								</u-list-item>
							</u-list>
						</uni-forms-item>-->
						<uni-forms-item label="审核评价" name="remark">
							<uni-list>
								<uni-list-item v-for="(item, index2) in target.commentRemark" :key="index2"
									:title="item.content">
									<!--<template v-slot:header>
										<view class="slot-box">
											<image class="slot-image" src="/static/images/icon_du_lv.png" mode="widthFix"></image>
										</view>
									</template>-->
									<template v-slot:body>
										<text class="slot-box slot-text">{{item.content}}</text>
									</template>
									<template v-slot:footer>
										<image class="slot-image" :src="getSrc(item.state)" mode="widthFix"
											style="height: 25px;width: 25px;margin-left: auto;"></image>
									</template>
								</uni-list-item>
							</uni-list>
						</uni-forms-item>
						<view class="" v-show="target.improveState!=1">
							<uni-forms-item label="评价" name="improveR">
								<uni-data-checkbox v-model="target.improveR" :localdata="resultOption" />
							</uni-forms-item>
						</view>
						<view class="" v-show="target.improveState!=1">
							<uni-forms-item label="审核意见" name="improveT">
								<uni-easyinput type="textarea" v-model="target.improveT" placeholder="请输入审核意见" />
							</uni-forms-item>
						</view>


					</uni-forms>
				</wyb-slide-listener>

			</swiper-item>
		</swiper>
		<view class="media">
			<u-cell-group>
				<u-cell isLink icon="file-text-fill" title="实证资料" @click="viewFile">
					<u-badge slot="value" :showZero="true" :value="fileNum"></u-badge>
				</u-cell>
			</u-cell-group>
		</view>
	</view>
</template>

<script>
	import storage from '@/utils/storage'
	import wybSlideListener from '@/components/wyb-slide-listener/wyb-slide-listener.vue'
	import {
		getSchoolTarget,
		commitComment
	} from "@/api/supervise/work.js"
	import {
		isNotNull
	} from "@/utils/common.js"
	export default {
		data() {
			return {
				resultOption: [{
					text: '合格',
					value: 1
				}, {
					text: '不合格',
					value: 2
				}],
				activityId: "",
				// 活动指标id
				targetId: "",
				schoolId: "",
				comments: [],
				targets: [],
				firstComments: [],
				index: 0,
				fileNum: 0
			}
		},
		methods: {
			submit() {
				/*
				let param = {}
				param.improveState = uni.getStorageSync("targetImproveState")
				param.improveState = 2
				param.schoolId = uni.getStorageSync("schoolId")

				let commentSchools = [];

				//console.log(this.comments)


				for (let i = 0; i < this.comments.length; i++) {

					let commentSchool = {}

					commentSchool.commentId = this.comments[i].id;

					for (let j = 0; j < this.targets.length; j++) {

						if (this.comments[i].targetId == this.targets[j].id) {
							commentSchool.content = this.targets[j].improveT
							commentSchool.improveState = this.targets[j].improveR
							if (commentSchool.content == null) {
								return;
							}
							if (commentSchool.improveState == null) {
								return;
							}
						}

					}


					commentSchools.push(commentSchool)

				}
				let stringSchools = JSON.stringify(commentSchools)
				param.commentSchool = stringSchools

				commitCommentSchool(param).then(res => {
					console.log(res)
					//this.$tab.navigateTo("/pages/work/workCheck/view-content");
					if (res.status == 0) {
						uni.redirectTo({
							url: "/pages/work/workCheck/view-content"
						})
					} else {
						this.$u.toast(res.result);
					}

				})*/
				
				let commentId = this.targets[0].commentId
				let content = this.targets[0].improveT
				let state = this.targets[0].improveR
				
				console.log(commentId+"="+content+"="+state)
				
				commitComment(commentId,content,state).then(res=>{
					console.log(res)
					uni.redirectTo({
						url: "/pages/work/schoolFeedback/detail/school-rectify"
					})
				})

			},
			onSlide: function(e) {
				let type = e.type
				switch (type) {
					case 'slideLeft':
						if (this.index < this.targets.length - 1) {
							this.index++;
							this.getFileNum();
						}
						break
					case 'slideRight':
						if (this.index > 0) {
							this.index--;
							this.getFileNum();
						}
						break
				}
			},
			changeIndicatorDots(e) {
				this.indicatorDots = !this.indicatorDots
			},
			changeAutoplay(e) {
				this.autoplay = !this.autoplay
			},
			intervalChange(e) {
				this.interval = e.target.value
			},
			durationChange(e) {
				this.duration = e.target.value
			},
			getTargetContent() {
				this.schoolId = uni.getStorageSync("schoolId")
				this.activityId = uni.getStorageSync("activityId")
				this.targetId = uni.getStorageSync("targetId")
				/*
				getSchoolTarget(this.targetId).then(res=>{
					console.log(res)
				})*/

				getSchoolTarget(this.targetId).then(res => {
					console.log(res)
					//this.targets = res.targets
					let targets = res.targets
					let comments = res.comments
					let firstComments = res.firstComments
					for (let i = 0; i < targets.length; i++) {

						for (let j = 0; j < comments.length; j++) {

							if (comments[j].targetId == targets[i].id) {
								targets[i].commentRemark = comments[j].commentRemark
								targets[i].createTime = comments[j].createTime
								targets[i].improveState = comments[j].improveState
								targets[i].commentId = comments[j].id
							}

						}
						
						for (let j = 0; j < firstComments.length; j++) {
						
							if (firstComments[j].targetId == targets[i].id) {
								targets[i].firstlight = firstComments[j].light
								targets[i].firstcontent = firstComments[j].content
							}
						
						}
						
						targets[i].result = this.getResult(targets[i])

					}

					let targetName = uni.getStorageSync("targetName")
					uni.setNavigationBarTitle({
						title: targetName
					})
					this.targets = targets;
					this.comments = comments;
					let targetImproveState = uni.getStorageSync("targetImproveState");

					if ((targetImproveState == 0) || (targetImproveState == 2)) {
						this.changeNaBtnTitle("提交")
					} else {
						this.changeNaBtnTitle("提交了")
					}
					this.comments.forEach(item => {
						item["imgUrls"] = isNotNull(item.imgUrl) ? item.imgUrl.split(",") : [];
						item["voiceUrls"] = isNotNull(item.voiceUrl) ? item.voiceUrl.split(",") : [];
						item["videoUrls"] = isNotNull(item.videoUrl) ? item.videoUrl.split(",") : [];
					})
					this.getFileNum()
					//console.log(targets)

				})
			},
			changeNaBtnTitle(text) {
				var pages = getCurrentPages();
				var page = pages[pages.length - 1];
				var currentWebview = page.$getAppWebview();
				var tn = currentWebview.getStyle().titleNView;

				if (text == "提交了") {
					tn.buttons[0].width = 0;
					currentWebview.setStyle({
						titleNView: tn
					});
				} else {
					tn.buttons[0].text = text;
					currentWebview.setStyle({
						titleNView: tn
					});
				}
			},
			getResult(value) {

				let result = "";

				if (value.improveState == 2) {
					result = "不合格";
				} else if (value.improveState == 1) {
					result = "合格";
				}

				if (value.firstlight != null) {
					result = result + "\n亮点：" + value.firstlight
				}

				if (value.firstcontent != null) {
					result = result + "\n问题：" + value.firstcontent
				}

				return result;

			},
			getSrc(state) {
				if (state == 1) {
					return "/static/images/icon_du_lv.png";
				} else {
					return "/static/images/icon_school_lv.png";
				}
			},
			viewFile() {
				if (this.fileNum == 0) {
					this.$u.toast("暂无实证资料");
					return;
				}
				const comment = this.comments[this.index];
				const fileUrls = {
					imgUrls: comment.imgUrls,
					voiceUrls: comment.voiceUrls,
					videoUrls: comment.videoUrls,
				}
				this.$tab.navigateTo("/pages/empirical-file/empirical-file?fileUrls=" + encodeURIComponent(JSON
					.stringify(fileUrls)));
			},
			getFileNum() {
				let num = 0;
				const comment = this.comments[this.index]
				num += comment.imgUrls.length;
				num += comment.voiceUrls.length;
				num += comment.videoUrls.length;
				this.fileNum = num;
			}

		},
		onLoad: function(option) {
			this.getTargetContent();
		},
		onNavigationBarButtonTap(e) {

			// 点击导航栏自定义按钮
			this.submit()
		}
	}
</script>

<style lang="scss" scoped>
	.record-container {
		font-size: 20px;

		.swiper {
			width: 100vw;
			min-height: 150vh;
		}



		.title-box {}

		.title-height {
			height: 7vh;
			line-height: 7vh;
			background-color: #F2F2F0;
		}

		.content {
			min-height: 7vh;
			background-color: #fff;
			// padding: 0 12px;
		}

		.pl-12 {
			padding-left: 12px;

		}

		.radio {
			padding-left: 10px;
		}

		.media {
			position: fixed;
			left: 0;
			right: 0;
			bottom: 0;
			height: 3vh;
			display: flex;
			background-color: #fff;
		}

	}

	.media {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		height: 3vh;
		display: flex;
		background-color: #fff;
	}

	/deep/ .is-disabled {
		background-color: #ffffff !important;
		color: #0d0d0d !important;
	}
</style>